/*
 * @Author: ZYH
 * @Date: 2022-08-06 21:32:10
 * @LastEditTime: 2022-08-11 08:43:22
 * @Description: 配置文件
 */

// 表单属性【右面板】
export const formConf = {
  formRef: 'elForm',
  formModel: 'formData',
  size: 'medium',
  labelPosition: 'right',
  labelWidth: 100,
  formRules: 'rules',
  gutter: 15,
  disabled: false,
  span: 24,
  formBtns: true
}

// 输入型组件 【左面板】
export const inputComponents = [
  {
    // 组件的自定义配置
    __config__: {
      label: '单行文本',
      labelWidth: null,
      showLabel: true,
      changeTag: true,
      tag: 'a-input',
      tagIcon: 'input',
      defaultValue: undefined,
      required: true,
      layout: 'colFormItem',
      span: 10,
      document: 'https://www.antdv.com/components/input-cn',
      // 正则校验规则
      regList: [],
    },
    // 组件的插槽属性
    __slot__: {
      prepend: '',
      append: '',
    },
    // 其余的为可直接写在组件标签上的属性
    componentProps:{
  placeholder: '请输入',
    style: { width: '100%' },
    clearable: true,
    'prefix-icon': '',
    'suffix-icon': '',
    maxlength: null,
    'show-word-limit': false,
    readonly: false,
    disabled: false,
    },
    id: '1',
  },
  {
    id: '2',
    __config__: {
      label: '多行文本',
      labelWidth: null,
      showLabel: true,
      tag: 'a-textarea',
      tagIcon: 'textarea',
      defaultValue: undefined,
      required: true,
      layout: 'colFormItem',
      span: 4,
      regList: [],
      changeTag: true,
      document: 'https://www.antdv.com/components/input-cn',
    },
    componentProps: {
      type: 'textarea',
      placeholder: '请输入',
      style: { width: '100%' },
      maxlength: null,
      'show-word-limit': false,
      readonly: false,
      disabled: false,
    },
  },
  {
    id: '3',
    __config__: {
      label: '密码',
      showLabel: true,
      labelWidth: null,
      changeTag: true,
      tag: 'a-input-password',
      tagIcon: 'password',
      defaultValue: undefined,
      layout: 'colFormItem',
      span: 24,
      required: true,
      regList: [],
      document: 'https://www.antdv.com/components/input-cn',
    },
    __slot__: {
      prepend: '',
      append: '',
    },
    componentProps: {
      placeholder: '请输入',
      'show-password': true,
      style: { width: '100%' },
      clearable: true,
      'prefix-icon': '',
      'suffix-icon': '',
      maxlength: null,
      'show-word-limit': false,
      readonly: false,
      disabled: false,
    },
  },
  {
    id: '4',
    __config__: {
      label: '计数器',
      showLabel: true,
      changeTag: true,
      labelWidth: null,
      tag: 'a-input-number',
      tagIcon: 'number',
      defaultValue: undefined,
      span: 24,
      layout: 'colFormItem',
      required: true,
      regList: [],
      document: 'https://www.antdv.com/components/input-number-cn',
    },
    componentProps: {
      placeholder: '',
      min: undefined,
      max: undefined,
      step: 1,
      'step-strictly': false,
      precision: undefined,
      'controls-position': '',
      disabled: false,
    },
  },
  {
    id: '5',
    __config__: {
      label: '编辑器',
      showLabel: true,
      changeTag: true,
      labelWidth: null,
      tag: 'a-input',
      tagIcon: 'rich-text',
      defaultValue: null,
      span: 24,
      layout: 'colFormItem',
      required: true,
      regList: [],
      document: 'http://tinymce.ax-z.cn',
    },
    componentProps: {
      placeholder: '请输入',
      height: 300, // 编辑器高度
      branding: false, // 隐藏右下角品牌烙印
    },
  },
];

// 选择型组件 【左面板】
export const selectComponents = [
  {
    id: 11,
    __config__: {
      label: '下拉选择',
      showLabel: true,
      labelWidth: null,
      tag: 'a-select',
      tagIcon: 'select',
      layout: 'colFormItem',
      span: 24,
      required: true,
      regList: [],
      changeTag: true,
      document: 'https://www.antdv.com/components/select-cn',
    },
    __slot__: {
      options: [
        {
          label: '选项一',
          value: 1,
        },
        {
          label: '选项二',
          value: 2,
        },
      ],
    },
    placeholder: '请选择',
    style: { width: '100%' },
    clearable: true,
    disabled: false,
    filterable: false,
    multiple: false,
  },
  {
    id: 12,
    __config__: {
      label: '级联选择',
      url: 'https://www.fastmock.site/mock/f8d7a54fb1e60561e2f720d5a810009d/fg/cascaderList',
      method: 'get',
      dataPath: 'list',
      dataConsumer: 'options',
      showLabel: true,
      labelWidth: null,
      tag: 'a-cascader',
      tagIcon: 'cascader',
      layout: 'colFormItem',
      defaultValue: [],
      dataType: 'dynamic',
      span: 24,
      required: true,
      regList: [],
      changeTag: true,
      document: 'https://www.antdv.com/components/cascader-cn',
    },
    options: [
      {
        id: 1,
        value: 1,
        label: '选项1',
        children: [
          {
            id: 2,
            value: 2,
            label: '选项1-1',
          },
        ],
      },
    ],
    placeholder: '请选择',
    style: { width: '100%' },
    props: {
      props: {
        multiple: false,
        label: 'label',
        value: 'value',
        children: 'children',
      },
    },
    'show-all-levels': true,
    disabled: false,
    clearable: true,
    filterable: false,
    separator: '/',
  },
  {
    id: 13,
    __config__: {
      label: '单选框组',
      labelWidth: null,
      showLabel: true,
      tag: 'a-radio-group',
      tagIcon: 'radio',
      changeTag: true,
      defaultValue: undefined,
      layout: 'colFormItem',
      span: 24,
      optionType: 'default',
      regList: [],
      required: true,
      border: false,
      document: 'https://www.antdv.com/components/radio-cn',
    },
    __slot__: {
      options: [
        {
          label: '选项一',
          value: 1,
        },
        {
          label: '选项二',
          value: 2,
        },
      ],
    },
    style: {},
    size: 'medium',
    disabled: false,
  },
  {
    id: 14,
    __config__: {
      label: '多选框组',
      tag: 'a-checkbox-group',
      tagIcon: 'checkbox',
      defaultValue: [],
      span: 24,
      showLabel: true,
      labelWidth: null,
      layout: 'colFormItem',
      optionType: 'default',
      required: true,
      regList: [],
      changeTag: true,
      border: false,
      document: 'https://www.antdv.com/components/checkbox-cn',
    },
    __slot__: {
      options: [
        {
          label: '选项一',
          value: 1,
        },
        {
          label: '选项二',
          value: 2,
        },
      ],
    },
    style: {},
    size: 'medium',
    min: null,
    max: null,
    disabled: false,
  },
  {
    id: 15,
    __config__: {
      label: '开关',
      tag: 'a-switch',
      tagIcon: 'switch',
      defaultValue: false,
      span: 24,
      showLabel: true,
      labelWidth: null,
      layout: 'colFormItem',
      required: true,
      regList: [],
      changeTag: true,
      document: 'https://www.antdv.com/components/switch-cn',
    },
    style: {},
    disabled: false,
    'active-text': '',
    'inactive-text': '',
    'active-color': null,
    'inactive-color': null,
    'active-value': true,
    'inactive-value': false,
  },
  {
    id: 16,
    __config__: {
      label: '滑块',
      tag: 'a-slider',
      tagIcon: 'slider',
      defaultValue: null,
      span: 24,
      showLabel: true,
      layout: 'colFormItem',
      labelWidth: null,
      required: true,
      regList: [],
      changeTag: true,
      document: 'https://www.antdv.com/components/slider-cn',
    },
    disabled: false,
    min: 0,
    max: 100,
    step: 1,
    'show-stops': false,
    range: false,
  },
  {
    id: 17,
    __config__: {
      label: '时间选择',
      tag: 'a-time-picker',
      tagIcon: 'time',
      defaultValue: null,
      span: 24,
      showLabel: true,
      layout: 'colFormItem',
      labelWidth: null,
      required: true,
      regList: [],
      changeTag: true,
      document: 'https://www.antdv.com/components/time-picker-cn',
    },
    placeholder: '请选择',
    style: { width: '100%' },
    disabled: false,
    clearable: true,
    'picker-options': {
      selectableRange: '00:00:00-23:59:59',
    },
    format: 'HH:mm:ss',
    'value-format': 'HH:mm:ss',
  },
  {
    id: 18,
    __config__: {
      label: '时间范围',
      tag: 'a-time-picker',
      tagIcon: 'time-range',
      span: 24,
      showLabel: true,
      labelWidth: null,
      layout: 'colFormItem',
      defaultValue: null,
      required: true,
      regList: [],
      changeTag: true,
      document: 'https://www.antdv.com/components/time-picker-cn',
    },
    style: { width: '100%' },
    disabled: false,
    clearable: true,
    'is-range': true,
    'range-separator': '至',
    'start-placeholder': '开始时间',
    'end-placeholder': '结束时间',
    format: 'HH:mm:ss',
    'value-format': 'HH:mm:ss',
  },
  {
    id: 19,
    __config__: {
      label: '日期选择',
      tag: 'a-date-picker',
      tagIcon: 'date',
      defaultValue: null,
      showLabel: true,
      labelWidth: null,
      span: 24,
      layout: 'colFormItem',
      required: true,
      regList: [],
      changeTag: true,
      document: 'https://www.antdv.com/components/date-picker-cn',
    },
    placeholder: '请选择',
    type: 'date',
    style: { width: '100%' },
    disabled: false,
    clearable: true,
    format: 'yyyy-MM-dd',
    'value-format': 'yyyy-MM-dd',
    readonly: false,
  },
  {
    id: 20,
    __config__: {
      label: '日期范围',
      tag: 'el-date-picker',
      tagIcon: 'date-range',
      defaultValue: null,
      span: 24,
      showLabel: true,
      labelWidth: null,
      required: true,
      layout: 'colFormItem',
      regList: [],
      changeTag: true,
      document: 'https://www.antdv.com/components/date-picker-cn',
    },
    style: { width: '100%' },
    type: 'daterange',
    'range-separator': '至',
    'start-placeholder': '开始日期',
    'end-placeholder': '结束日期',
    disabled: false,
    clearable: true,
    format: 'yyyy-MM-dd',
    'value-format': 'yyyy-MM-dd',
    readonly: false,
  },
  {
    id: 21,
    __config__: {
      label: '评分',
      tag: 'a-rate',
      tagIcon: 'rate',
      defaultValue: 0,
      span: 24,
      showLabel: true,
      labelWidth: null,
      layout: 'colFormItem',
      required: true,
      regList: [],
      changeTag: true,
      document: 'https://www.antdv.com/components/rate-cn',
    },
    style: {},
    max: 5,
    'allow-half': false,
    'show-text': false,
    'show-score': false,
    disabled: false,
  },

  {
    id: 23,
    __config__: {
      label: '上传',
      tag: 'a-upload',
      tagIcon: 'upload',
      layout: 'colFormItem',
      defaultValue: null,
      showLabel: true,
      labelWidth: null,
      required: true,
      span: 24,
      showTip: false,
      buttonText: '点击上传',
      regList: [],
      changeTag: true,
      fileSize: 2,
      sizeUnit: 'MB',
      document: 'https://www.antdv.com/components/upload-cn',
    },
    __slot__: {
      'list-type': true,
    },
    action: 'https://jsonplaceholder.typicode.com/posts/',
    disabled: false,
    accept: '',
    name: 'file',
    'auto-upload': true,
    'list-type': 'text',
    multiple: false,
  },
];

// 布局型组件 【左面板】
export const layoutComponents = [
  {
    id: 24,
    __config__: {
      layout: 'rowFormItem',
      tagIcon: 'row',
      label: '行容器',
      layoutTree: true,
      document: 'https://element.eleme.cn/#/zh-CN/component/layout#row-attributes',
    },
    type: 'default',
    justify: 'start',
    align: 'top',
  },
  {
    id: 25,
    __config__: {
      label: '按钮',
      showLabel: true,
      changeTag: true,
      labelWidth: null,
      tag: 'a-button',
      tagIcon: 'button',
      span: 24,
      layout: 'colFormItem',
      document: 'https://www.antdv.com/components/button-cn',
    },
    __slot__: {
      default: '主要按钮',
    },
    type: 'primary',
    icon: 'el-icon-search',
    round: false,
    size: 'medium',
    plain: false,
    circle: false,
    disabled: false,
  },
  {
    id: 26,
    __config__: {
      layout: 'colFormItem',
      tagIcon: 'table',
      tag: 'a-table',
      document: 'https://www.antdv.com/components/table-cn',
      span: 24,
      formId: 101,
      renderKey: 1595761764203,
      componentName: 'row101',
      showLabel: true,
      changeTag: true,
      labelWidth: null,
      label: '表格[开发中]',
      dataType: 'dynamic',
      method: 'get',
      dataPath: 'list',
      dataConsumer: 'data',
      url: 'https://www.fastmock.site/mock/f8d7a54fb1e60561e2f720d5a810009d/fg/tableData',
      children: [
        {
          __config__: {
            layout: 'raw',
            tag: 'el-table-column',
            renderKey: 15957617660153,
          },
          prop: 'date',
          label: '日期',
        },
        {
          __config__: {
            layout: 'raw',
            tag: 'el-table-column',
            renderKey: 15957617660152,
          },
          prop: 'address',
          label: '地址',
        },
        {
          __config__: {
            layout: 'raw',
            tag: 'el-table-column',
            renderKey: 15957617660151,
          },
          prop: 'name',
          label: '名称',
        },
        {
          __config__: {
            layout: 'raw',
            tag: 'el-table-column',
            renderKey: 1595774496335,
            children: [
              {
                __config__: {
                  label: '按钮',
                  tag: 'el-button',
                  tagIcon: 'button',
                  layout: 'raw',
                  renderKey: 1595779809901,
                },
                __slot__: {
                  default: '主要按钮',
                },
                type: 'primary',
                icon: 'el-icon-search',
                round: false,
                size: 'medium',
              },
            ],
          },
          label: '操作',
        },
      ],
    },
    data: [],
    directives: [
      {
        name: 'loading',
        value: true,
      },
    ],
    border: true,
    type: 'default',
    justify: 'start',
    align: 'top',
  },
];
